<#include "../common/layoutWithOutDocType.ftl"/>
<@layoutWithOutDocType>


<table width="100%">
<tr>

<td width="60%" valign="top">

  <div class="well" style="height:800px">
  		<!--百度地图容器-->
  	<div id="container"></div>
  	<div id="results"></div>
<style type="text/css"> 
#container{height:100%}
</style> 
<!--引用百度地图API-->
<script type="text/javascript" src="http://api.map.baidu.com/api?key=&v=1.2&services=true"></script>
<script type="text/javascript" src="/js/baiduMap/MarkerTool.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/library/TextIconOverlay/1.2/src/TextIconOverlay_min.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/library/DistanceTool/1.2/src/DistanceTool_min.js"></script>
<script type="text/javascript" src="/js/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript" src="/js/bootstrap-datetimepicker.zh-CN.js"></script>
<script type="text/javascript" src="/js/checkArea.js"></script>
<script>
 var beginPoint ;
 var endPoint ;
 var map;
 var issubmit=false;
	 
	//创建和初始化地图函数：
    function initMap(){
        createMap();//创建地图
        setMapEvent();//设置地图事件
        addMapControl();//向地图添加控件
    }
    
    //创建地图函数：
    function createMap(){
        map = new BMap.Map("container");//在百度地图容器中创建一个地图
        var point = new BMap.Point(121.488186,31.225696);//定义一个中心点坐标<上海>
        map.centerAndZoom(point,12);//设定地图的中心点和坐标并将地图显示在地图容器中
        window.map = map;//将map变量存储在全局
    }
    //地图事件设置函数：
    function setMapEvent(){
        map.enableDragging();//启用地图拖拽事件，默认启用(可不写)
        map.enableScrollWheelZoom();//启用地图滚轮放大缩小
        map.enableDoubleClickZoom();//启用鼠标双击放大，默认启用(可不写)
        map.enableKeyboard();//启用键盘上下左右键移动地图
    }
    
    //地图控件添加函数：
    function addMapControl(){
	    //向地图中添加缩放控件
		var ctrl_nav = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});
		map.addControl(ctrl_nav);
	    //向地图中添加缩略图控件
		var ctrl_ove = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:1});
		map.addControl(ctrl_ove);
	    //向地图中添加比例尺控件
		var ctrl_sca = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});
		map.addControl(ctrl_sca);
    }
    
    
    
    initMap();
    
    $(document).ready(function(){
		
		$("#serverDate").datetimepicker({ format: 'yyyy-mm-dd', language: 'zh-CN', minView: 'month', pickDate: true, pickTime: false, inputMask: false, autoclose: true });
		
		$("#serverTime").datetimepicker({ format: 'HH:ii', language: 'zh-CN',minView: 'hour', startView: 'day', pickDate: true, pickTime: true, inputMask: false, autoclose: true,startDate:'${varDate}' });
		
		$("#paidanTime").datetimepicker({ format: 'yyyy-mm-dd HH:ii', language: 'zh-CN', pickDate: true, pickTime: true, inputMask: false, autoclose: true });
    
    });
    
    
    function markBegin(){
	    var mkrTool = new BMapLib.MarkerTool(map,{followText: "点击地图添加标注"});
	    mkrTool.addEventListener("markend", function(evt){ 
		    beginPoint = evt.marker;
		    beginPoint.enableDragging(true); // 设置标注可拖拽
		    $("#startpoint_longitude").val(beginPoint.getPosition().lng);
			 $("#startpoint_latitude").val(beginPoint.getPosition().lat);
			 
		    beginPoint.addEventListener("dragend" , function(){
			     $("#startpoint_longitude").val(beginPoint.getPosition().lng);
			 	 $("#startpoint_latitude").val(beginPoint.getPosition().lat);
		    	  
			     var pt = beginPoint.getPosition();
			      

		    		
		    		
			     var gc = new BMap.Geocoder();
			     gc.getLocation(pt, function(rs){
				    var addComp = rs.addressComponents;
				    
				    $("#startpoint").val(addComp.district + addComp.street + addComp.streetNumber);
				    route();
				});  
		    })
		    //TODO
		    var gc = new BMap.Geocoder(); 
		    var pt = beginPoint.point; 

		   markerComplete(pt.lng,pt.lat);
		   
		     gc.getLocation(pt, function(rs){
			    var addComp = rs.addressComponents;
			    var  s=$("#startpoint").val();
			    if(s.length==0)
			    	$("#startpoint").val(addComp.district + addComp.street + addComp.streetNumber);
			});  
		});
	
	     mkrTool.open(); //打开工具 
	     var icon= new BMap.Icon('/img/marker/start.png', new BMap.Size(38, 33), {
    			imageOffset: new BMap.Size(0, 0)    //图片的偏移量。为了是图片底部中心对准坐标点。
	  			}
			);
		 mkrTool.setIcon(icon);
		 $("#beginChooser").attr("disabled" , true);
		 
	 }
	 
	 function checkMobile(mobile)
	 {

	 			$.ajax({
				    type : "POST",
				    url : "/member/findByPhone",
				    dataType : "json",
				     data: {'phone':mobile},
				    success : function(data) {
				    if(data.member)
				    {
				    	
				    	$("#clientPhone").val(data.member.cell_phone);
				    	$("#clientName").val(data.member.real_name);
				    	$("#memberID").val(data.member.id);
				    	$("#clientVirtual").text(data.finishmoney+"元");
				    	
				    	if(data.member.sex==0)
				    	$("#membertype").html("男");
				    	if(data.member.sex==1)
				    	$("#membertype").html("女");
				    	if(data.member.sex==2)
				    	$("#membertype").html("未知");
				    	
				    	//$("#allcount").html(data.order_count);
				    	$("#allcount").html("<a target='_blank' href='/order/memberOrder/"+data.member.id+"'>"+data.order_count+"</a>");
				    	
				    	$("#cancalcount").html(data.cancel_order_count);
    					$("#monthcount").html(data.month_order_count);
    					$("#todayordernums_div").slideDown();
				    	
				    	
				    	
				    }
				    else
				    {
				    	$("#clientName").val("");
				    	$("#memberID").val("");
				    	$("#clientVirtual").text("0元");
				    	
				    	$("#membertype").html("未知");
						            
				    	$("#allcount").html("0");

				    	$("#cancalcount").html("0");
    					$("#monthcount").html("0");
    					$("#todayordernums_div").slideUp();
				    }
				    
				        
				        //console.info(data);
				    },
				    error : function(textStatus) {
				        alert("出错");
				    }
				});
				
				
	 	/*
	 			$.get('/member/findByPhone',{'phone':mobile},function(data){
    			if(data.success){
    				$("#clientName").val(data.object.name);
    				$("#clientVirtual").text(data.object.member.virtual+"元");
    				
    				$("#allcount").html(data.countnum);
    				$("#monthcount").html(data.longValue);
    				$("#membertype").html(data.object.member.type);
    				$("#todayordernums_div").slideDown();
    				
    				if(data.data && data.data.length>0){
    					$(".memberOrders-tr").remove();
    					$(data.data).each(function(index,element){
	    					var content="<tr class='memberOrders-tr'>";
    						if(element.status==0){
    							content+="<td><span class='label label-info'>新订单</span></td>";
							}
    						else if(element.status==1){
    							content+="<td><span class='label label-warning'>已派单</span></td>";
							}
							else{
								content+="<td><span class='label label-danger'>服务中</span></td>";
							}
    						content+="<td><a target='_blank' href='/order/detail/"+element.id+"'>***"+element.orderNumber.substring(8)+"</a></td>"+
									"<td>"+element.orderType+"</td>"+
									"<td>"+element.fromSource+"</td>"+
									"<td>"+element.serverTimeHI+"</td>"+
									"<td>"+element.fromPlace+"</td>"+
									"<tr>";
    						$("#memberOrders-table tbody").append(content);
    					});
    					
    					$("#memberOrders-table").show();
    				}
    				else{
    					$("#memberOrders-table").hide();
    				}
    				
    			}
    			else{
    				$("#todayordernums_div p").html('');
    				$("#todayordernums_div").slideUp();
    				$("#memberOrders-table").hide();
    				$("#clientVirtual").text("0元");
    				$("#membertype").html("");
    			}
    		});
    		
    	*/	
	 }
	 
	 
//改变驾车路线回调
	function markerComplete(lng,lat){

		//附近司机
	
		
	    $.get('/driver/listdistance',{'longitude':lng,'latitude':lat},function(data,status){

	    	$(".drivers-tr").remove();
	    	if(status=="success"){
				if(data && data.length>0){
					$(data).each(function(i,driver){
						var content="<tr class='drivers-tr'>"+
									"<td><input type='checkbox' name='check_drivers' value='"+driver.id+"' /></td>"+
									"<td>"+driver.realname+"</td>"+
									"<td>"+driver.distance+"</td>"+
									"<td>"+driver.todayOrders+"次</td>"+
									"<td>"+driver.monthOrders+"次</td>"+
									"<tr>";
						$("#drivers-table tbody").append(content);
					});
				}
			}
			else
			{
				alert("查找附近司机失败");
			}
		});
	}	 
	
	 function markEnd(){
	    var mkrTool = new BMapLib.MarkerTool(map,{followText: "点击地图添加标注"});
	    mkrTool.addEventListener("markend", function(evt){ 
		    endPoint = evt.marker;
		    endPoint.enableDragging(true); // 设置标注可拖拽
		    $("#endpoint_longitude").val(endPoint.getPosition().lng);
			$("#endpoint_latitude").val(endPoint.getPosition().lat);
		    endPoint.addEventListener("dragend" , function(){
			     $("#endpoint_longitude").val(endPoint.getPosition().lng);
				 $("#endpoint_latitude").val(endPoint.getPosition().lat);
		    	 var gc = new BMap.Geocoder(); 
			     var pt = endPoint.point; 
			     gc.getLocation(pt, function(rs){
				    var addComp = rs.addressComponents;
				    $("#endpoint").val(addComp.district + addComp.street + addComp.streetNumber);
				    route();
				});  
		    })
		    //alert(marker.getPosition().lng + " , " + marker.getPosition().lat);
		    var gc = new BMap.Geocoder(); 
		     var pt = endPoint.point; 
		     gc.getLocation(pt, function(rs){
			    var addComp = rs.addressComponents;
			    $("#endpoint").val(addComp.district + addComp.street + addComp.streetNumber);
			    route();
			});  
		});
	     mkrTool.open(); //打开工具 
	     var icon= new BMap.Icon('/img/marker/end.png', new BMap.Size(38, 33), {
    			imageOffset: new BMap.Size(0, 0)    //图片的偏移量。为了是图片底部中心对准坐标点。
	  			}
			);
		 mkrTool.setIcon(icon);
		 $("#endChooser").attr("disabled" , true);
	 }
	 
    
	 
	 function route(){
	 	var output = "";
		var searchComplete = function (results){
		    if (transit.getStatus() != BMAP_STATUS_SUCCESS){
		        return ;
		    }
		   var plan = results.getPlan(0);
		   $("#kilometre_adv").text(plan.getDistance(true));
		}
		var transit = new BMap.DrivingRoute(map, {renderOptions: {map: map},
		    onSearchComplete: searchComplete,
		    onPolylinesSet: function(){        
		        setTimeout(function(){},"1000");
		    }});
		if(beginPoint && endPoint){
			transit.search(beginPoint.getPosition(), endPoint.getPosition());
		}
	 }
	 
	 function search(){
	 	var local = new BMap.LocalSearch(map, {
		  renderOptions: {map: map, panel: "results"}
		});
		
		local.search($("#startpoint").val());
			 	
	 }
	 function dis(){
	 	  var myDis = new BMapLib.DistanceTool(map);
	 	  myDis.open();
	 }
	 
	 
	 function formCheck(){
	 		if(issubmit) return false;
	 		issubmit=true;

	 		if($("#startpoint_longitude").val().length==0 || $("#startpoint_latitude").val().length==0){
				//$.scojs_message("请先在地图上指定 定位代驾地点", $.scojs_message.TYPE_ERROR);
				alert("请先在地图上指定 定位代驾地点");
				issubmit=false;
				return false;
			}
	
			var cPhone=$("#clientPhone").val();
			//var isphone=/^\+?\d{3,13}(\-?(\d{6,8}?))?(\-?(\d{4,8}?))*$/; 
			var isphone=/^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;
			if (cPhone.length!=11 || !isphone.test(cPhone)){
				//$.scojs_message("客户手机格式不正确", $.scojs_message.TYPE_ERROR);
				alert("客户手机格式不正确");
				issubmit=false;
				return false;
			}
			
		 	if($("#clientName").val().length==0 ){
				//$.scojs_message("请先在地图上指定 定位代驾地点", $.scojs_message.TYPE_ERROR);
				alert("客户姓名不能为空");
				issubmit=false;
				return false;
			}		

		 	if($("#startpoint").val().length==0 ){
				//$.scojs_message("请先在地图上指定 定位代驾地点", $.scojs_message.TYPE_ERROR);
				alert("出发地不能为空");
				issubmit=false;
				return false;
			}			
		
			
			
			if($("#serverDate").val().length==0 || $("#serverTime").val().length==0){
				//$.scojs_message("服务时间不能为空", $.scojs_message.TYPE_ERROR);
				alert("服务时间不能为空");
				issubmit=false;
				return false;
			}
			if($("#driverNum").val().length==0){
				//$.scojs_message("人数不能为空", $.scojs_message.TYPE_ERROR);
				alert("人数不能为空");
				issubmit=false;
				return false;
			}

		
			
			
			
			//禁用按钮
			$("#submitBnt").attr("disabled",true);
			
			$.post($("#form1").attr("action"),$("#form1").serialize(),function(){
				window.opener.location.reload(true);
				window.close();
			});
			
			//$("#form1").submit();
			
	 		issubmit=false;
			return true;
	}
	 
	 
</script>
  </div>
  </div>
</td>


<td width="40%" valign="top">

<div class="row">

	<form id="form1" class="form-horizontal " onsubmit="return formCheck();" action="/order/save3"  method="post" >
<div class="col-md-12">
			<div class="panel panel-default">
			<span class="input-group-addon" style="height:36px">添加新订单</span>
			
			    <div class="panel-body">
    				    <input type="hidden" id="startpoint_longitude" name="order.startpoint_longitude" value="">
    					<input type="hidden" id="startpoint_latitude" name="order.startpoint_latitude" value="">
   	                
		                <div class="form-group">
		                    <div class="col-sm-9">
		                    	<div class="input-group">
		                    		<span class="input-group-addon">客户手机</span>
		                    		<#if telCallNumb ??>
				            			<input class="form-control" id="clientPhone" name="clientPhone"  value="${telCallNumb}" type="text" required="" style="height:36px" onchange="checkMobile(this.value);">
				            			<script> checkMobile("${telCallNumb}");</script>
				            		<#else>
				            			<input class="form-control" id="clientPhone" name="clientPhone"  value="" type="text" required="" style="height:36px" onchange="checkMobile(this.value);">
				            		</#if>
            	
				            		<input class="form-control" id="memberID" name="memberID"  value="0" type="hidden" >
			                	</div>
			                </div>
			                <div class="col-sm-3" style="padding-left:0px;margin-top:6px;">
			                	<span class="label label-info" style="font-size:14px;" id="membertype"></span>
			                </div>
		                </div>
		                <div class="form-group">
		                    <div class="col-sm-9">
		                    	<div class="input-group">
		                    	<span class="input-group-addon">客户姓名</span>
				            	<input class="form-control" id="clientName" name="clientName" type="text" value="" style="height:36px">
			                	</div>
			                </div>
			                <div class="col-sm-3" style="padding-left:0px;margin-top:6px;">
			                	<span class="label label-warning" style="font-size:14px;" id="clientVirtual">0元</span>
			                </div>
		                </div>
		                
           
		                
		                <div id="todayordernums_div" style="display: none;">
			                <div class="form-group">
			                	<div class="col-sm-4">
				                    <label><em>&nbsp;&nbsp;</em>总下单量：</label>
				                    <label>
				                    <p class="form-control-static" id="allcount">
				                    <#if member ??>
				                    <a target='_blank' href='/order/memberOrder/${member.id}'></a>
						            <#else>
						            </#if>
						            </p>
						            </label>
					            </div>
					            <div class="col-sm-4">
						            <label><em>&nbsp;&nbsp;</em>取消：</label>
				                    <label>
						            	<p class="form-control-static" id="cancalcount"></p>
						            </label>
					            </div>
					            <div class="col-sm-4">
						            <label><em>&nbsp;&nbsp;</em>本月单量：</label>
				                    <label>
						            	<p class="form-control-static" id="monthcount"></p>
						            </label>
					            </div>
			                </div>
		                </div>

		                <div class="form-group"></div>
		                <div class="form-group">
		                    <div class="col-sm-12">
			                    <div class="input-group">
			                    	<span class="input-group-addon">出发地</span>
				                    <input placeholder="附近的小区/街道/建筑物/商圈" class="form-control" id="startpoint" name="order.startpoint" type="text" value="" autocomplete="off" required="" style="height:36px">
				         

     				                    <span class="input-group-btn">
				                            <button class="btn btn-default" type="button" id="btn-position" onclick="search()">定位</button>
				                    </span>
				                    <span class="input-group-btn">
				                            <button class="btn btn-default" type="button" id="btn-position" onclick="markBegin()">地图上选择定位点</button>
				                    </span>
			                    </div>
			                </div>
			            </div>    

		                <div class="form-group">
		                    <div class="col-sm-6">
		                    	<div class="input-group">
		                    	<span class="input-group-addon">目标区域</span>
		                    	     <select name="province" id="province" onchange="cityName(this.selectedIndex)" style="height:36px">
									    <option value="">
									                      请选择区域
									    </option>
									 </select>
			                	</div>
			                </div>
		              </div>
		                <div class="form-group">
		                    <div class="col-sm-6">
		                    	<div class="input-group">
			                	<span class="input-group-addon">大概地点</span>
			                		<select name="city" id="city" style="height:36px">
									    <option value="方向未确定">
									                   方向未确定
									    </option>
									</select>
			                	</div>
			                </div>
		              </div>		              
		              
		              <div class="form-group col-sm-5">
		                    <div>
				            	<input class="form-control" id="serverDate" name="serverD" type="text" value="${varDate}" required="" style="height:36px">
			                </div>
		                </div>
		                
		                <div class="form-group col-sm-4">
		                    <div>
				            	<input class="form-control" id="serverTime" name="serverT" type="text" value="${varTime}" required="" style="height:36px">
			                </div>
		                </div>
		                
		                <div class="form-group col-sm-4">
		                    <div class="input-group">
		                    	<span class="input-group-addon">人数</span>
				            	<input class="form-control" id="driverNum" name="driverNum" type="number" value="1" required="" min="1" style="height:36px">
			                </div>
		                </div>

		                <div class="form-group col-sm-12">
		                    <div class="input-group">
		                    	<span class="input-group-addon">公里数</span>
								<input class="form-control" id="driverKm" name="driverKm" value="0" type="number" required="" style="height:36px">
		                    	<span class="input-group-addon">公司定价(元)</span>
								<input class="form-control" id="driverMoney" name="driverMoney" value="0" type="number" required="" style="height:36px">								
			                </div>
		                </div>

      
				    	<div class="form-group"></div>
		                <div class="form-group col-sm-6">
		                    <div class="input-group">
		                    	<span class="input-group-addon">订单来源</span>
		                    	<#if fromSource ??>
		                    	<input class="form-control" id="fromSource" name="fromSource" type="text" value="${fromSource}" readonly="true" style="height:36px">
			                	<#else>
			                	<input class="form-control" id="fromSource" name="fromSource" type="text" value="" readonly="true" style="height:36px">
			                	</#if>
			                	<input class="form-control" id="fromSourceValue" name="fromSourceValue"  value="0" type="hidden" >
			                </div>
		                </div>
		                
		                <div class="form-group col-sm-6">
		                    <div class="input-group">
		                    	<span class="input-group-addon">派单范围</span>
				            	<input class="form-control" id="driverRateKm" name="driverRateKm" type="number" value="10" required="" min="1" style="height:36px">
			                	<span class="input-group-addon">公里</span>
			                </div>
		                </div>		                
		                
		                <div class="form-group">
		                    <div class="col-sm-6">
		                    	<div class="input-group">
		                    		<span class="input-group-addon" style="height:36px">选择优惠券</span>
				            		<select name="coupon" id="coupon" style="height:36px">
									    <option value="">
									                   请选择优惠券
									    </option>
									</select>

			                	</div>
			                </div>
			                
			                <div class="form-group col-sm-5">
		                    <div>
		                    	<div class="input-group">
				            		<span class="input-group-addon" style="height:36px">优惠券密码</span>
				            		<input class="form-control" id="couponPass" name="couponPass" type="text" value=""  style="height:36px" >
			                	</div>
			                </div>
		                </div>
		                </div>            
		                

		                
		                <div class="form-group">
		                    <label><em>&nbsp;&nbsp;</em>订单备注：</label>
		                    <div class="col-sm-12">
				            	<textarea class="form-control" cols="20" id="memo" name="memo" rows="2"></textarea>
			                </div>
		                </div>
    					
		                <div class="form-group">
			                <span class="input-group-addon">
			                <button type="submit" id="submitBnt" name="submitBnt" class="btn btn-primary" >创建并派单</button>
			                <button type="button" class="btn btn-info" onclick="javascript:history.back();">返回</button>
			                </span>
			            </div>
			            
					
        		</div>
			</div>
		</div>
		
		
	
  </form>
  </div>
</td>

</tr>
</table>
 <script>
 
   loadProvince();
 /*  
	$(function() { 
     $("#form1").validity(function() {
         $("#userarea").require();
         $("#startpoint").require();
         $("#endpoint").require();
         $("#area_num").require();
	     $("#startpoint_longitude").require();
	     $("#startpoint_latitude").require();
	     $("#province").require();
	     $("#city").require();
	     $("#orderNum").require();
	     
     });
     
 }); 
 */
</script>
</@layoutWithOutDocType>